<template>
    <div class="right">
        <h1>{{msg}}</h1>
        <button @click="cancel">取消订阅</button>
    </div>
</template>

<script>
import pub from 'pubsub-js'
export default {
  data(){
    return{
        msg:''
    }
  },
  /*
    created的钩子函数，当组件被创建完之后被调用
  */
  created(){
    this.pubid=pub.subscribe('shigekey',(key,content)=>{
       this.msg=content
    })
  },
  methods:{
    cancel(){
        pub.unsubscribe(this.pubid)
    }
  }
}
</script>

<style>
    .right{
        width: 100vw;
        height: 200px;
        background-color: yellow;
        color: red;
    }
</style>